<template>
  <div>
    <V-CommonHeaderLeft>
      <div class="container">
        <div class="nav">
          <navigation :msg="navMsg"></navigation>
        </div>
        <div class="content">
          <div class="head">
            <div class="span">
              <b>企业信息</b>
              <span></span>
            </div>
            <div class="tree-list-top-right">
              <span class="iconfont icon-test187 left"></span>
              <span>编辑</span>
            </div>
          </div>
          <div id="basic">
            <p>
              <span></span>基本信息
            </p>
            <div id="ul">
              <ul class="ul1">
                <li>
                  <span>公司名称</span>
                  <span>素然时尚服饰集团</span>
                </li>
                <li>
                  <span>所在地区</span>
                  <span>广东 深圳 南山区</span>
                </li>
                <li>
                  <span>公司名称</span>
                  <span>陈素然</span>
                </li>
                <li>
                  <span>企业简介</span>
                  <span>这里请输入您的企业简介... ...</span>
                </li>
                <li>
                  <span>商城LOGO</span>
                  <img src="../../../../static/images/suran.png" width="200" height="50" alt="logo">
                </li>
              </ul>
              <ul class="ul2">
                <li>
                  <span>联系电话</span>
                  <span>020-84111234</span>
                </li>
                <li>
                  <span>详细地址</span>
                  <span>天河路198号</span>
                </li>
                <li>
                  <span>手机</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                  <span>13500001111</span>
                </li>
                <li>
                  <span>微信公众号</span>
                  <img
                    src="../../../../static/images/erweima.png"
                    width="50"
                    height="50"
                    alt="微信公众号"
                  >
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </V-CommonHeaderLeft>
  </div>
</template>

<script>
import VCommonHeaderLeft from '@/components/common/vCommonHeaderLeft/VCommonHeaderLeft'
import navigation from '@/components/common/navigation/Navigation'
export default {
  data () {
    return {
      navMsg: [
        {
          name: '设置',
          path: '/enterpriseInformation'
        },
        {
          name: '企业信息',
          path: '/enterpriseInformation'
        }
      ]
    }
  },
  created () { },
  methods: {},
  components: {
    VCommonHeaderLeft,
    navigation
  }
}
</script>

<style lang="scss" scoped>
.container {
  width: 100%;
  margin-right: 10px;
  .content {
    background-color: #fff;
    width: 100%;
    height: 644px;
    box-sizing: border-box;
    .head {
      height: 50px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #20ade5;
      border-bottom: 1px solid #e3e3e3;
      box-sizing: border-box;
      .span {
        width: 110px;
        position: relative;
        // border:1px solid red;
        text-align: center;
        b {
          margin-left: 40px;
        }
        span {
          display: block;
          width: 110px;
          height: 2px;
          background-color: #20ade5;
          position: absolute;
          top: 35px;
          left: 20px;
        }
      }
      .tree-list-top-right {
        margin-right: 50px;
        .iconfont {
          cursor: pointer;
          margin-right: 5px;
        }
      }
    }

    #basic {
      box-sizing: border-box;
      padding-left: 20px;
      padding-right: 20px;
      p {
        font-weight: 700;
        height: 50px;
        line-height: 50px;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        border-bottom: 1px solid #e3e3e3;
        box-sizing: border-box;
        padding-top: 15px;
        span {
          display: inline-block;
          width: 2px;
          height: 16px;
          margin-right: 5px;
          background-color: #000;
        }
      }
      #ul {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        ul {
          width: 80%;
          li {
            height: 50px;
            border-bottom: 1px solid #f5f5f5;
            font-size: 12px;
            color: #666;
            display: flex;
            align-items: center;
            justify-content: flex-start;
            box-sizing: border-box;
            padding-top: 10px;
            span:nth-of-type(1) {
              margin-left: 10px;
              margin-right: 50px;
            }
            &::before {
              content: "·";
              font-size: 40px;
              color: #d2d2d2;
            }
          }
        }
        .ul1 {
          margin-right: 50px;
          li:last-child {
            height: 70px;
          }
        }
        .ul2 {
          li:last-child {
            height: 120px;
            img {
              width: 50px;
              height: 50px;
            }
          }
        }
      }
    }
  }
}
</style>
